var path = require('path');
var webpack = require('webpack');

// 开发环境
const isDev = process.env.NODE_ENV.trim() === 'development';

var app_path = path.resolve(__dirname,'app');
var dist_path = isDev?path.resolve(__dirname,'dist'):path.resolve(__dirname,'build');
var node_modules_dir = path.resolve(__dirname,'node_modules');
// var OpenBrowserPlugin = require('open-browser-webpack-plugin');//webpack插件
// var CleanPlugin = require('clean-webpack-plugin')//webpack插件，用于清除目录文件
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var precss = require('precss');
var postcss = require('postcss-loader');
var cssnext = require('cssnext');
var autoprefixer = require('autoprefixer');
var cssnano = require('cssnano');
var WebpackMd5Hash = require('webpack-md5-hash');

// 资源依赖包，提前编译
const lib = [
  'react',
  'react-dom',
  'react-router',
  'history',
  'redux',
  'react-redux',
  'react-router-redux',
  'redux-thunk',
];

const plugin = [

  new ExtractTextPlugin('static/css/pages.[contenthash:6].css'),
  new webpack.optimize.CommonsChunkPlugin({
    name: "vendor",
    minChunks: Infinity,
  }),
  new HtmlWebpackPlugin({
    title:'美人谷',
    template:path.resolve(app_path,'./pages/index.html'),
    filename:path.resolve(dist_path,'index.html'),
    inject:true,
    chunks:['main','vendor']
  }),
  new webpack.ProvidePlugin({
    $:'zepto',
    Zepto:'zepto',
    'window.Zepto':'zepto',
    'window.$':'zepto'
  })
  // new CleanPlugin(['dist', 'build']),
  // new webpack.HotModuleReplacementPlugin(),
  // new OpenBrowserPlugin({ url: 'http://localhost:8080' }),
];

if (!isDev) {
  console.log('pro is running' + '_______' )
  plugin.push(
    new WebpackMd5Hash(),
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('production')
    }),
    new webpack.optimize.UglifyJsPlugin({
      // mangle: {
      //   except: ['$', 'exports', 'require']
      // },
      compress: { warnings: false },
      output: { comments: false },
      minimize: true
    })
  )
}

module.exports = {
  devtool: '#source-map',
  entry:{
    'main':path.resolve(app_path,'main.js'),
    'vendor':['react','react-dom','react-router','redux','react-router-redux','redux-thunk']
  },
  output:{
    path:dist_path,
    filename:'static/js/[name].[chunkhash:6].js',
    publicPath:'./'
  },
  resolve:{
    extensions:['','.js','.jsx'],
    alias:{
      "swiper":path.resolve(app_path,'static/js/swiper.js'),
      'react':path.resolve(node_modules_dir, 'react/dist/react.min.js'),
      'react-dom':path.resolve(node_modules_dir, 'react-dom/dist/react-dom.min.js'),
      'zepto':path.resolve(__dirname, 'app/static/js/zepto.js'),
    }
  },
  module:{
    // noParse:['react','react-dom','zepto','swiper'],
    loaders:[
      {
        test:/\.(js|jsx)$/,
        loader:'babel',
        exclude:/node_modules/,
        query:{
          presets:['es2015','stage-2','react']
        }
      },
      {
        test:/\.css$/,
        exclude:/node_modules/,
        loader:ExtractTextPlugin.extract('style-loader','css!postcss')
      },
      {
        test:/\.scss$/,
        exclude:/node_modules/,
        loader:ExtractTextPlugin.extract('style-loader','css!postcss!sass')
      },
      {
        test: /\.(png|jpg|gif)$/,
        loader: 'url-loader?name=./static/img/[chunkhash:6].[ext]',
      },
      // {
      //   test: require.resolve('zepto'),  // 此loader配置项的目标是NPM中的jquery
      //   loader: 'expose?$!expose?Zepto', // 先把jQuery对象声明成为全局变量`jQuery`，再通过管道进一步又声明成为全局变量`$`
      // },
    ]
  },
  postcss:function(){
    return [autoprefixer,cssnext,precss,cssnano]
  },
  plugins:plugin
}
